/**
 * 这个是优化结构前的代码 虽然结构比较不好看，但是相对上来说更加的好理解一点
 *  优化的代码在 bundle.js 那个相当于是webpack的原型了
 */
(function () {
  // 定义一个全局的 require 方法
  function require(filePath) {
    // 创建文件之间的映射关系
    const map = {
      './foo.js': foojs,
      './main.js': mainjs,
      './demo.js': demojs,
    };

    const fn = map[filePath];

    const module = {
      exports: {},
    };

    fn(require, module, module.exports);

    return module.exports;
  }

  require('./main.js');
  // mainjs(); // 执行
  // main.js
  function mainjs(require, module, exports) {
    /**
     * import { handlerAdd } from "./foo.js";
     * 正常情况下 这么写是会报错的
     *  因为 ESM 规范 ES的模块化语法只能在顶层作用域中
     *  而这里是出现在非顶层
     * 我们利用seaJS也就是类似余commonjs思想，转换一下模块化导入导出
     *  const { handlerAdd } = require(./foo.js)
     */

    const { handlerAdd } = require('./foo.js');
    const { baseConsole } = require('./demo.js');

    console.log(handlerAdd(1, 2));
    console.log('start！------------！');
    baseConsole();
  }

  function foojs(require, module, exports) {
    // foo.js
    /**
     * 通过 seajs 类似 commonjs的规范 改写导出
     * export function handlerAdd 改成 module.exports
     */
    // export function handlerAdd(a, b) {
    //   return a + b;
    // }
    function handlerAdd(a, b) {
      return a + b;
    }
    module.exports = { handlerAdd };
  }

  function demojs(require, module, exports) {
    // demo.js
    // export function baseConsole() {
    //   console.log("hello miniwebpack");
    // }
    function baseConsole() {
      console.log('hello miniwebpack');
    }
    module.exports = { baseConsole };
  }
})();
